import Vue from 'vue'
import Vuex from 'vuex'
import menu from './modules/menu'
import role from './modules/role'
import user from './modules/user'
import cate from './modules/cate'
import specs from './modules/specs'
import goods from './modules/goods'
import member from './modules/member'
import banner from './modules/banner'
import seck from './modules/seck'

Vue.use(Vuex)
/*
  封装仓库原因
    因为我们实现添加，编辑，删除之后重新调用接口。但是我们做了组件拆分。vue中每一个组件都是独立的，如果添加重新出发了列表接口，他是不会影响独立列表中的列表的
  所以我们发现多个组件公用一个数据结果，我们自然想要vuex状态管理
*/ 

export default new Vuex.Store({
  state: {
    userInfo:sessionStorage.getItem('userInfo') ? JSON.parse(sessionStorage.getItem('userInfo')) : null
  },
  getters: {
    getUser(state){
      return state.userInfo
    }
  },
  mutations: {
    REQ_USERINFO(state,payload){
      if(payload){
        state.userInfo = payload;
        // 把结果存储到绘画存储中
        sessionStorage.setItem('userInfo',JSON.stringify(payload))
      }else{
        // 清空存储内容
        sessionStorage.removeItem('userInfo')
      }
    }
  },
  actions: {
    changeUserInfo({commit},payload){
      commit('REQ_USERINFO',payload)
    }
  },
  modules: {
    menu,
    role,
    user,
    cate,
    specs,
    goods,
    member,
    banner,
    seck
  }
})
